const onSpanChange = (e: MouseEvent, callback = (v: string) => {
}) => {
    let target: HTMLSpanElement = e.target as HTMLSpanElement;
    if (target.innerHTML.indexOf('type="text"') > 0) {
        return                     //判断是否进入编辑状态
    }
    const newdiv = document.createElement('input') //创建一个input标签
    newdiv.type = 'text'         //设置标签类型
    newdiv.style.width = '80px'  //设置下输入框的宽度,不设置很丑
    newdiv.style.height = '40px' //设置下输入框的高度
    newdiv.style.fontSize = "18px"
    newdiv.style.outline = "none"
    newdiv.value = target.innerHTML   //将原来文本内容赋值给input标签

    target.innerHTML = ''             //清除原来的内容
    target.appendChild(newdiv)        //将input标签添加到元素中
    newdiv.setSelectionRange(0, target.innerHTML.length)  //设置光标位置
    //（在获得焦点的时候，选中所有文本）
    newdiv.focus()               //设置元素获得焦点，失去焦点触发onblur

    newdiv.onblur = blur         //设置失去焦点事件
    newdiv.onkeyup = function () { //设置回车时执行失去焦点事件
        if (event.keyCode == 13) {
            newdiv.blur()
        }
    }

    function blur() {
        target.innerHTML = this.value //将文本内容重新赋值给元素
        callback(this.value);
    }
}
export default onSpanChange;